<!--
 * @Author: tianhao
 * @Date: 2023-01-02 16:24:41
 * @LastEditTime: 2023-02-21 19:40:16
 * @LastEditors: tianhao
 * @Description: 
 * @FilePath: \dcollege\src\views\paper\presubmit.vue
 * 可以输入预定的版权声明、个性签名、空行等
-->
<template>
    <div class="top">
      <var-icon name="chevron-left" :size="30" class="ret" @click="fanHui()" />
      <div class="title1">论文提交</div>
    </div>
    <div class="jingxuan" v-for="ti in data">
      <!-- <a href="/details"> -->
      <router-link :to="{ name: 'submit', query: { title: ti.title, name: ti.teacher } }">
        <div class="q">
          <div class="title3">{{ ti.title }}</div>
          <div class="icon">可选</div>
          <div class="time">指导老师:{{ ti.teacher }}</div>
          <!-- <var-icon name="chevron-right" class="tubiao" color="black" /> -->
        </div>
      </router-link>
      <!-- </a> -->
    </div>
  </template>
  
  <script setup lang="ts">
  import { ref } from "vue";
  import { useRouter } from "vue-router";
  import { useCourseStore } from "@/stores/course";
  import { storeToRefs } from "pinia";
  const router = useRouter();
  const CourseStore = useCourseStore();
  const { userCourse } = CourseStore;
  const { courseList } = storeToRefs(CourseStore);
  userCourse();
  function fanHui() {
    router.go(-1);
  }
  const data = ref([
    { id: 1, title: "基于ASP.NET", teacher: "王果儿", count: 25 },
    {
      id: 2,
      title: "基于ASP.NET实现的实验室网络管理系统",
      teacher: "王利群",
      count: 25,
    },
    {
      id: 3,
      title: "基于ASP.NET实现的实验室网络管理系统",
      teacher: "王果儿",
      count: 25,
    },
  ]);
  </script>
  
  <style lang="less" scoped>
  .top {
    width: 100%;
    height: 60px;
    border-bottom: none;
  }
  .ret {
    float: left;
    margin-top: 30px;
  }
  .title1 {
    font-size: 20px;
    position: absolute;
    margin-top: 30px;
    margin-left: 150px;
  }
  a {
    color: black;
  }
  .jingxuan {
    width: 95%;
    height: 100px;
    background-color: white;
    border-radius: 10px;
    margin-left: 10px;
    margin-top: 10px;
    color: black;
  }
  .q {
    width: 100%;
    height: 100px;
  }
  .title3 {
    float: left;
    margin: 15px auto auto 10px;
    color: black;
  }
  .icon {
    width: 40px;
    height: 20px;
    background-color: rgb(66, 106, 237);
    border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    float: right;
    text-align: center;
    font-size: 13px;
    color: white;
  }
  .time {
    position: absolute;
    color: rgb(123, 121, 121);
    margin: 60px auto auto 10px;
    font-size: 10px;
  }
  .tubiao {
    position: absolute;
    margin: 40px auto auto 220px;
  }
  </style>
  